﻿@{
    ViewBag.Title = "公告列表";

}
@section styles{
    <link href="~/static/css/client.css" type="text/css" rel="stylesheet" />
    <link href="~/static/css/system.css" type="text/css" rel="stylesheet" />
    <link href="~/static/css/contract.css" type="text/css" rel="stylesheet" />
}
<style>
    a {
        text-decoration: none;
    }
</style>
<div class="layui-fluid layui-content">
    <div class="layui-title layui-clear layui-row">
        <h2 class="layui-col-md10 layui-col-sm9 layui-col-xs7">@ViewBag.Title</h2>
        <div class="layui-col-md2 layui-col-sm3 layui-col-xs5 layui-nav-item">
            <a class="layui-btn layui-btn-xs layer-load-new" onclick="LayerOpen('添加公告','@Url.Action("Create")')">添加公告</a>
        </div>
    </div>
    <div class="layui-eacher layui-row layui-clear">
        <form class="layui-clear">
            @*<div class="layui-form layui-clear">
                <div class="layui-col-md6 layui-col-pc7 layui-col-lg7 layui-form-group">
                    <label class="layui-form-label">
                        关键字：
                    </label>
                    <div class="layui-input-block">
                        <input type="text" class="layui-input" name="keyword" id="keyword" />
                    </div>
                </div>
                <div class="layui-col-md1">
                    <button class="layui-btn layui-btn-sm layui-btn-normal" id="search" type="button"> 搜索 </button>
                </div>
            </div>*@
        </form>
    </div>
    <div class="layui-data layui-table-container">
        <table class="layui-hide layui-table" id="layui-table" lay-filter="table"></table>
    </div>
</div>
<div id="Layer_ajax" class="deploy-plus"></div>

<script type="text/html" id="barDemo">
    <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
</script>
<script type="text/html" id="operating">
    <div class="layui-form">
        {{#  if(d.isActive){ }}
        <input type="checkbox" name="zzz" lay-skin="switch" checked value="{{d.id }}" lay-filter="checkbox" lay-text="启用|停用">
        {{#  }else{ }}
        <input type="checkbox" name="zzz" lay-skin="switch" value="{{d.id }}" lay-filter="checkbox" lay-text="启用|停用">
        {{# } }}
    </div>
</script>
@section scripts{
    @*
        <script src="~/Theme/js/content.min.js?v=1.0.0"></script>*@
    <script src="~/static/js/jquery.ztree.core.js" type="text/javascript"></script>
    <script src="~/static/js/jquery.ztree.excheck.js" type="text/javascript"></script>
    <script src="~/static/js/jquery.ztree.exedit.js" type="text/javascript"></script>
    <script src="~/js/main.js"></script>

    @*
        <script src="~/Theme/js/plugins/layer/laydate/laydate.js"></script>*@
    <script type="text/javascript">
        var tables;
        var tableH = $(".layui-table-container").height();
        layui.use(['form', 'layedit', 'laydate', 'tree', 'table', 'layer', 'upload'], function () {
            var form = layui.form
                , layer = layui.layer
                , layedit = layui.layedit
                , laydate = layui.laydate
                , form = layui.form
                , table = layui.table
                , upload = layui.upload;


            tables= table.render({
                elem: "#layui-table",
                url: '/Notice/GetNoticeData',
                cellMinWidth: 26,
                height: tableH,

                cols: [[
                    { type: 'checkbox' },
                    { field: 'noticeName', title: '公告标题' },
                    {
                        field: 'creationTime', title: '创建时间', templet: function (d) {
                            var creationTime = new Date(d.creationTime);
                            return 'creationTime', top.dateFtt("yyyy-MM-dd hh:mm:ss", creationTime);
                        }
                    },
                    { field: 'isActive', align: 'center', title: '是否启用', toolbar: '#operating', width: 100, unresize: true },
                    { title: '操作', width: 213, align: 'center', toolbar: '#barDemo' }
                ]],
                id: "idTest",
                //limits: [1, 2, 3, 5, 6],
                page: true,

            });

            //监听状态开关
            form.on('switch(checkbox)', function (data) {
                var id = data.value;
                var prompt = ""
                if (data.elem.checked) {
                    prompt = "公告已启用！"
                } else {
                    prompt = "公告已停用！"
                }

                $.get("/Notice/SwitchActive?id=" + id + "&active=" + data.elem.checked, function (r) {
                    if (r.success) {
                        layer.msg(prompt, {
                            icon: 1,
                            time: 2000
                        });
                    } else {
                        layer.msg("操作失败", {
                            icon: 2,
                            time: 2000
                        });
                    }

                })
            });

            //监听工具条
            table.on('tool(table)', function (obj) {
                var data = obj.data;
                if (obj.event === 'del') {
                    layer.confirm('确定删除该行？', function (index) {
                        $.get("/Notice/DeleteNotice?id=" + data.id, function (obj, successInfo) {
                            CommonAjaxCallback(obj, function () {
                                table.reload('idTest', {
                                    page: {
                                        curr: 1 //重新从第 1 页开始
                                    }
                                })
                            }, successInfo)
                        })
                        layer.close(index);
                    });
                } else if (obj.event === 'edit') {
                    LayerOpen("公告编辑", "/Notice/Edit?id=" + data.id);
                }
            });

            //$('#search').on('click', function () {
            //    table.reload('idTest', {
            //        where: {
            //            shopTypeid: $('#shopTypeid').val(),
            //            keyword: $('#keyword').val(),
            //        },
            //        page: {
            //            curr: 1 //重新从第 1 页开始
            //        }
            //    })

            //})
        });

        $("#layui-Area").click(function () {
            $(".layui-Area .layui-Area-hide").toggleClass("layui-Area-show")
            $(this).parent(".layui-form-select").toggleClass("layui-form-selected");
        });

        $(".layui-Area").mouseleave(function () {
            $(".layui-Area .layui-Area-hide").removeClass("layui-Area-show")
        })

        $(document).ready(function () {

        });
        function LayerOpen(title, url) {
            var open = layer.open({
                type: 2,
                title: title,
                shadeClose: true,
                shade: false,
                maxmin: true, //开启最大化最小化按钮
                area: ['400px', '250px'],
                content: url,
                success: function (layero, index) {
                    var body = layer.getChildFrame('body', index)//确定两个页面的父子关系
                },
                end: function () {
                    //销毁后重新加载

                    tables.reload('idTest', {
                        page: {
                            curr: 1 //重新从第 1 页开始
                        }
                    })
                }
            });
        }

        function ReloadAjaxCallbackgoback(data, successInfo) {
            CommonAjaxCallback(data, function () {
                tables.reload('idTest', {
                    page: {
                        curr: 1 //重新从第 1 页开始
                    }
                })
            }, successInfo)
        }
    </script>
}

